<template>
	<view class="content">
		<nav-header bgColor="bg-custom-color" :isBack="true">
			<block slot="content">{{$t('order.lineUpOrderRecord')}}</block>
		</nav-header>
		
		<scroll-view scroll-x class="bg-white nav text-center fixed" :style="[{top:CustomBar + 'px'}]">
			<view class="cu-item" :class="index==TabCur?'text-blue cur':''" v-for="(item,index) in tabNav" :key="index" @tap="tabSelect"
			 :data-id="index">
				{{tabNav[index]}}
			</view>
		</scroll-view>
		
		<block v-if="TabCur==0">
			<view class="kuangyuan">
				<view class="kuangyuan-title">矿源</view>
				<view class="kuangyuan-title">1000</view>
			</view>
			<view class="par ky-lc2">
				<view class="son">
					<view class="ky-lc2-title">我的矿源</view>
					<view class="ky-lc2-value">1500</view>
				</view>
				<view class="son">
					<view class="ky-lc2-title">已使用矿源</view>
					<view class="ky-lc2-value">800</view>
				</view>
			</view>
			<view class="padding flex flex-direction">
				<button class="cu-btn bg-tm lg" @click="$common.toPage('../order/form_kuangyuan')">充值</button>
				<button class="cu-btn bg-tm lg margin-tb-sm">记录</button>
			</view>
		</block>
		<block v-if="TabCur==1">
			<view class="buy">
				<image class="img-view" src="../../static/img/buy_suanli.png" mode="aspectFit" style="height: 90px;"></image>
				<view class="buy-title" style="">购买矿机</view>
			</view>
		
			<view class="tip">
				<view class="tip-son">200起购</view>
				<view class="tip-son">限额1000</view>
				<view class="tip-son">最小单位20USDT</view>
			</view>
			<view class="sl-lc2">
				<view style="float: left;">
					<view class="sl-lc2-title">持有数量</view>
					<view class="sl-lc2-value">{{datas.count}}</view>
				</view>
				<view style="float: left;margin-left: 30px;">
					<view class="sl-lc2-title" style="color: #9985C3;">预约数量</view>
					<view class="sl-lc2-value" style="color: #9985C3;">{{datas.count2}}</view>
				</view>
				<view class="sysl" style="">剩余算力:{{datas.sumOrderMoney}}/{{datas.orderMoneySumMax}}</view>
				<view class="cu-progress round">
					<view class="bg-red" style="background-color: #7CECF8;" :style="[{ width:loading?datas.sumOrderMoney/datas.orderMoneySumMax+'%':''}]"></view>
				</view>
			</view>
		
			<view class="cu-form-group">
				<view class="title">GHMI</view>
				<input name="ghmi" v-model="ghmi" placeholder="输入GHMI金额" />
			</view>
			<view class="cu-form-group">
				<view class="title">可兑换算力(USDT)</view>
				<view>{{$common.numFilter(ghmi * bili)}}</view>
			</view>
			<view class="padding flex flex-direction">
				<button class="cu-btn bg-tm lg" :style="is?'':'background-color: var(--darkGray);'" @tap="tijiao">{{is?'立即购买':'提交中'}}</button>
			</view>
		</block>

		<view class="cu-list menu card-menu wallet">
			<view class="lc2-son">
				<view class="lc2-son2 " v-for="(item,index) in list" style="padding: 10px;">
					<view class="lc2-son-par">
						<text class="lc2-son2-text text-color" style="text-align: left;">{{item.tradeIndex}}</text>
						<text class="lc2-son2-text text-color" style="text-align: right;">{{item.orderState == 10?$t('order.unfinished'):$t('order.completed')}}</text>
					</view>

					<view class="">
						<view class="cl2-son2-title" v-if="item.orderState == 10"><text class="text-color" >{{$t('order.notReturnMoney')}}:</text><text class="text-color">{{item.orderMoney}}USDT</text></view>
						<view class="cl2-son2-title" v-if="item.orderState == 50"><text class="text-color" >{{$t('order.returnMoney')}}:</text><text class="text-color">{{item.profitMoney?item.profitMoney:'0'}}USDT</text></view>
						<text class="cl2-son2-title text-color" style="text-align: left;">{{$common.dateFormat(item.addDate)}}</text>
					</view>
				</view>
			</view>
		</view>

	</view>


</template>

<script>
	let t;
	export default {
		data() {
			return {
				list: [],
				userInfo: null,

			}
		},
		onLoad() {
			t = this;
			this.$i18n.locale = t.$common.localRead("local")
			t.userInfo = $common.getUser();
			console.info(t.userInfo.id)
			t.getData();
		},
		methods: {
			getData() {
				let data = {
					addUserId: t.userInfo.id
				}
				t.$fetch.request('orderInfo/list', data).then((res) => {
					if (res.code == 200) {
						console.info("获取orderInfo/list成功")
						t.list = res.data.entityList
						// $common.setToken(res.data.token)
						// console.info($common.getToken())

						// t.getUserByToken()
					} else {
						$common.showToast(res.msg);
					}
				}).catch((e) => {})
			}
		}
	}
</script>

<style>
	
	.wallet .cu-item:after {
		border-bottom: 0px solid #ddd;
	}

	.wallet .cu-item {
		background-color: #121E2E;
	}

	.lc2-son2 {
		margin: 10px;
		padding: 5px;
		background-color: #121E2E;
		border-radius: 6px;
	}
	.cl2-son2-title{
		line-height: 48upx;
		height: 48upx;
	}

	.lc2-son-par {
		display: flex;
		height: 30px;
		line-height: 30px;
	}

	.lc2-son1-text {
		color: #5C7392;
		flex: 1;
		text-align: center;
	}

	.lc2-son2-text {
		flex: 1;
		text-align: center;

	}

	.cu-list.card-menu {
		overflow: hidden;
		margin-right: 0px;
		margin-left: 0px;
		border-radius: 0px;
	}

	.et-content {
		display: flex;
	}

	.et-text {
		flex: 1;
	}

	.lc1 {
		height: 60px;
		line-height: 60px;
		display: flex;
	}

	.lc1-box {
		/* display: inline-table; */
		flex: 1;
	}

	.lc1-1 {
		margin-left: 10px;
		font-weight: bold;
	}
</style>
